$('.leftf').mousemove(function(e) {	
	var event = window.event || e;
	console.log(1)
	$('.mengban').css({
		display: 'block'
	});

	$('.rightf').css({
		display: 'block'
	});
	//获取鼠标在small中的位置 (也就是为了设置areaDiv的left top 值)
	var x = event.clientX - $('.leftf').offset().left - $('.mengban').width() / 2;
	var y = event.clientY - $('.leftf').offset().top - $('.mengban').height() / 2;

	var maxX = $('.leftf').width() - $('.mengban').width(); //滑块移动x轴的最大值
	var maxY = $('.leftf').height() - $('.mengban').height(); //滑块移动y轴的最大值

	console.log(x);
	console.log(y);
	console.log(xr);
	console.log(yr);
	console.log(maxX);
	console.log(maxY);
	//为了不让滑块出small的范围,合理的设置左边距和上边距的值
	if(x < 0) { //左侧超出
		x = 0;
	}
	if(x > maxX) { //右侧超出
		x = maxX
	}
	if(y < 0) { //上侧超出
		y = 0
	}
	if(y > maxY) { //下侧超出
		y = maxY
	}

	$('.mengban').css({
		left: x,
		top: y
	});
	var xr = -($('.rightf>img').width() - $('.rightf').width()) * (x / maxX)
	var yr = -($('.rightf>img').height() - $('.rightf').height()) * (y / maxY)
	$('.rightf>img').css({
		left: xr,
		top: yr
	})

});

$('.leftf').mouseleave(function() {
	$('.rightf').css({
		display: 'none'
	});

	$('.mengban').css({
		display: 'none'
	})
})

var  lef=0
$('.left2a>img').click(function  () {
		lef-=60;
		if (lef<=-400) {
			lef=-400
		}
	$('.lunbos3').animate({
		left:lef
	},200);
	
	
});

$('.rightf2a>img').click(function  () {
		lef+=60;
		if (lef>=0) {
			lef=0
		}
	$('.lunbos3').animate({
		left:lef
	},200);
	
});

$('.lunbos3>li>img').click(function  () {
	
	var srcc=this.getAttribute('ms');
	console.log(srcc)
	$('.leftf>img').attr({
		src:srcc
	});
	$('.rightf>img').attr({
		src:srcc
	});
	
	$('.lunbos3>li>img').css({
		border:'1px solid white'
	})
	$(this).css({
		border:'1px solid red'
	})
	
	
	
})
